<html>
	<head>
		<title> Event's to-do list  </title>
		
		<SCRIPT language="javascript">
        
        function warning() {
            alert("The list is currently empty");
            }
    </SCRIPT>
 	</head>

	
	
	<body>

		<h1> 
			To-Do List		
		</h1>
		
<br />
        <form name="Edit" action="/DeleteTask/" method="POST">

    <TABLE id="dataTable"  name = "table " width="350px" border="1">
        <tr>
            <th>  {{ list.title }}  </th>
		</tr>
		 {% for I in items %}
			<tr>
			{% if I.completed %}
				<TD> <INPUT type="checkbox" name="task"  value =  "{{ I.title }}"  > <strike>{{ I.title }}</strike></TD>
			{% else %}
           		<TD> <INPUT type="checkbox" name="task"  value = "{{ I.title }}"  >{{ I.title }}</TD>
			{% endif %}   
        </tr>
         {% endfor%}
            {% if not items %}
		
		<script type="text/javascript" language="JavaScript">
         warning();
      </script>
		 	
		 	
		 {% endif %}
		
    </TABLE>
   
	
    <INPUT type="submit"  name = "delete" value="Delete Task"  />
    <INPUT type="submit" name = "complete" value="Complete Task " onclick = "Edit.action = '/CompleteTask/'; return true;" />

    </form>
      
		<form name="input" action="/AddTask/" method="POST">
		Description : <input  id = "textID" type="text" size="50" name="taskID" /></br>
		</br><INPUT type="submit" value="Add Task" />
		
		</form>
		
	</body>

</html>


